
<!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>Landrick - Saas & Software Landing Page Template</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="Premium Bootstrap 4 Landing Page Template" />
        <meta name="keywords" content="Saas, Software, multi-uses, HTML, Clean, Modern" />
        <meta name="author" content="Shreethemes" />
        <meta name="email" content="shreethemes@gmail.com" />
        <meta name="website" content="http://www.shreethemes.in" />
        <meta name="Version" content="v2.2" />
        <!-- favicon -->
        <link rel="shortcut icon" href="images/favicon.ico">
        <!-- Bootstrap -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- Icons -->
        <link href="css/materialdesignicons.min.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.1.7/css/unicons.css">
        <!-- Icons -->
        <link href="css/magnific-popup.css" rel="stylesheet" type="text/css" />
        <!-- Slider -->               
        <link rel="stylesheet" href="css/owl.carousel.min.css"/> 
        <link rel="stylesheet" href="css/owl.theme.default.min.css"/> 
        <!-- Animation -->
        <link href="css/animate.css" rel="stylesheet" />
        <link href="css/animations-delay.css" rel="stylesheet" /> 
        <!-- Main Css -->
        <link href="css/style.css" rel="stylesheet" type="text/css" id="theme-opt" />
        <link href="css/colors/default.css" rel="stylesheet" id="color-opt">

    </head>

    <body>
        <!-- Loader -->
        <!-- <div id="preloader">
            <div id="status">
                <div class="spinner">
                    <div class="double-bounce1"></div>
                    <div class="double-bounce2"></div>
                </div>
            </div>
        </div> -->
        <!-- Loader -->
        
        <!-- Navbar STart -->
        <header id="topnav" class="defaultscroll sticky">
            <div class="container">
                <!-- Logo container-->
                <div>
                    <a class="logo" href="index.html">
                        <img src="images/logo-dark.png" class="l-dark" height="24" alt="">
                        <img src="images/logo-light.png" class="l-light" height="24" alt="">
                    </a>
                </div>                 
                <div class="buy-button">
                    <a href="https://1.envato.market/4n73n" target="_blank">
                        <div class="btn btn-primary login-btn-primary">Buy Now</div>
                        <div class="btn btn-light login-btn-light">Buy Now</div>
                    </a>
                </div><!--end login button-->
                <!-- End Logo container-->
                <div class="menu-extras">
                    <div class="menu-item">
                        <!-- Mobile menu toggle-->
                        <a class="navbar-toggle">
                            <div class="lines">
                                <span></span>
                                <span></span>
                                <span></span>
                            </div>
                        </a>
                        <!-- End mobile menu toggle-->
                    </div>
                </div>
        
                <div id="navigation">
                    <!-- Navigation Menu-->   
                    <ul class="navigation-menu nav-light">
                        <li><a href="index.html">Home</a></li>
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Landing</a><span class="menu-arrow"></span>
                            <ul class="submenu megamenu">
                                <li>
                                    <ul>
                                        <li><a href="index-saas.html">Saas</a></li>
                                        <li><a href="index-classic-saas.html">Classic Saas</a></li>
                                        <li><a href="index-agency.html">Agency</a></li>
                                        <li><a href="index-apps.html">Application</a></li>
                                        <li><a href="index-classic-app.html">Classic Application</a></li>
                                        <li><a href="index-studio.html">Studio</a></li>
                                        <li><a href="index-business.html">Business</a></li>
                                        <li><a href="index-modern-business.html">Modern Business</a></li>
                                        <li><a href="index-hotel.html">Hotel</a></li>
                                        <li><a href="index-marketing.html">Marketing</a></li>
                                        <li><a href="index-enterprise.html">Enterprise </a></li>
                                    </ul>
                                </li>

                                <li>
                                    <ul>
                                        <li><a href="index-insurance.html">Insurance <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-shop.html">Shop <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-ebook.html">E-Book <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-coworking.html">Coworking</a></li>
                                        <li><a href="index-personal.html">Personal </a></li>
                                        <li><a href="index-services.html">Service </a></li>
                                        <li><a href="index-payments.html">Payments </a></li>
                                        <li><a href="index-crypto.html">Cryptocurrency </a></li>
                                        <li><a href="index-software.html">Software </a></li>
                                        <li><a href="index-car-riding.html">Car Ride</a></li>
                                    </ul>
                                </li>
                                <li>
                                    <ul>
                                        <li><a href="index-hosting.html">Hosting & Domain</a></li>
                                        <li><a href="index-event.html">Event</a></li>
                                        <li><a href="index-course.html">Course </a></li>
                                        <li><a href="index-online-learning.html">Online Learning</a></li>
                                        <li><a href="index-single-product.html">Product </a></li>
                                        <li><a href="index-portfolio.html">Portfolio </a></li>
                                        <li><a href="index-job.html">Job</a></li>
                                        <li><a href="index-customer.html">Customer</a></li>
                                        <li><a href="index-social-marketing.html">Social Media</a></li>
                                        <li><a href="index-digital-agency.html">Digital Agency</a></li>
                                        <li><a href="index-onepage.html">Saas <span class="badge badge-pill badge-warning ml-2">Onepage</span></a></li>
                                    </ul>
                                </li>   
                            </ul>
                        </li>
        
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Pages</a><span class="menu-arrow"></span>
                            <ul class="submenu">
                                <li><a href="page-aboutus.html"> About Us</a></li>
                                <li><a href="page-services.html">Services</a></li>
                                <li><a href="page-pricing.html">Pricing</a></li>
                                <li><a href="page-team.html"> Team</a></li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Account</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-profile.html">Profile</a></li>
                                        <li><a href="page-profile-edit.html">Account Setting</a></li>
                                        <li><a href="page-invoice.html">Invoice</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Shop <span class="badge badge-danger rounded">v 2.2</span></a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="shop-products.html">All Products <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-product-detail.html">Product Details <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-cart.html">Shop Cart <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-checkouts.html">Checkouts <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-myaccount.html">My Account <span class="badge badge-primary rounded">new</span></a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Help center <span class="badge badge-danger rounded">v 2.2</span></a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="helpcenter-overview.html">Helpcenter <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-faqs.html">Faqs <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-guides.html">Guides <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-support-request.html">Support Call <span class="badge badge-primary rounded">new</span></a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Email Template</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="email-confirmation.html">Confirmation</a></li>
                                        <li><a href="email-password-reset.html">Reset Password</a></li>
                                        <li><a href="email-alert.html">Alert</a></li>
                                        <li><a href="email-invoice.html">Invoice</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)">Careers</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-jobs.html">Jobs</a></li>
                                        <li><a href="page-jobs-sidebar.html">Jobs - Sidebar</a></li>
                                        <li><a href="page-job-detail.html">Job Detail</a></li>
                                        <li><a href="page-job-apply.html">Job Apply</a></li>
                                        <li><a href="page-job-company.html">Company</a></li>
                                        <li><a href="page-job-candidate.html">Candidate</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Blog</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-blog-grid.html">Blog Grid</a></li>
                                        <li><a href="page-blog-sidebar.html">Blog with Sidebar</a></li>
                                        <li><a href="page-blog-list.html">Blog Listing</a></li>
                                        <li><a href="page-blog-list-sidebar.html">Blog List & Sidebar</a></li>
                                        <li><a href="page-blog-detail.html">Blog Detail</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Works</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-work-modern.html">Works Modern</a></li>
                                        <li><a href="page-work-classic.html">Works Classic</a></li>
                                        <li><a href="page-work-grid.html">Works Grid</a></li>
                                        <li><a href="page-work-masonry.html">Works Masonry</a></li>
                                        <li><a href="page-work-detail.html">Work Detail</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Auth Pages</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="auth-login.html">Login</a></li>
                                        <li><a href="auth-cover-login.html">Login Cover</a></li>
                                        <li><a href="auth-login-three.html">Login Simple</a></li>
                                        <li><a href="auth-signup.html">Signup</a></li>
                                        <li><a href="auth-cover-signup.html">Signup Cover</a></li>
                                        <li><a href="auth-signup-three.html">Signup Simple</a></li>
                                        <li><a href="auth-re-password.html">Reset Password</a></li>
                                        <li><a href="auth-cover-re-password.html">Reset Password Cover</a></li>
                                        <li><a href="auth-re-password-three.html">Reset Password Simple</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Utility </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-terms.html">Terms of Services</a></li>
                                        <li><a href="page-privacy.html">Privacy Policy</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Special </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-comingsoon.html">Coming Soon</a></li>
                                        <li><a href="page-comingsoon2.html">Coming Soon Two </a></li>
                                        <li><a href="page-maintenance.html">Maintenance</a></li>
                                        <li><a href="page-error.html">Error</a></li>
                                    </ul>
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Contact </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-contact-detail.html">Contact Detail </a></li>
                                        <li><a href="page-contact-one.html">Contact One </a></li>
                                        <li><a href="page-contact-two.html">Contact Two </a></li>
                                        <li><a href="page-contact-three.html">Contact Three </a></li>
                                    </ul>  
                                </li>
                            </ul>
                        </li>
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Docs</a><span class="menu-arrow"></span>
                            <ul class="submenu">
                                <li><a href="documentation.html">Documentation </a></li>
                                <li><a href="changelog.html">Changelog </a></li>
                                <li><a href="components.html">Components</a></li>
                                <li><a href="widget.html">Widget</a></li>
                            </ul>
                        </li>
                    </ul><!--end navigation menu-->
                    <div class="buy-menu-btn d-none">
                        <a href="https://1.envato.market/4n73n" target="_blank" class="btn btn-primary">Buy Now</a>
                    </div><!--end login button-->
                </div><!--end navigation-->
            </div><!--end container-->
        </header><!--end header-->
        <!-- Navbar End -->
        
        <!-- Hero Start -->
        <section class="home-slider position-relative">
            <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
                <div class="carousel-inner">
                    <div class="carousel-item align-items-center active" style="background-image:url('images/coworking/bg01.jpg');">
                        <div class="bg-overlay"></div>
                        <div class="container">
                            <div class="row justify-content-center">
                                <div class="col-lg-12 text-center">
                                    <div class="title-heading mt-4">
                                        <h6 class="text-light para-dark animated fadeInDownBig animation-delay-1">Private office and Co-working space for <span class="text-success">$19</span></h6>
                                        <h1 class="heading mb-3 text-white title-dark animated fadeInUpBig animation-delay-3">Coworking  Space For a Success</h1>
                                        <p class="para-desc text-light para-dark mx-auto animated fadeInUpBig animation-delay-7">Launch your campaign and benefit from our expertise on designing and managing conversion centered bootstrap4 html page.</p>
                                        <div class="mt-4 pt-2 animated fadeInUpBig animation-delay-11">
                                            <a href="javascript:void(0)" class="btn btn-primary mt-2"><i class="mdi mdi-email"></i> Get Started</a>
                                        </div>
                                    </div>
                                </div><!--end col-->
                            </div><!--end row-->
                        </div><!--end container-->
                    </div><!--end carousel item-->

                    <div class="carousel-item align-items-center" style="background-image:url('images/coworking/bg02.jpg');">
                        <div class="bg-overlay"></div>
                        <div class="container">
                            <div class="row justify-content-center">
                                <div class="col-lg-12 text-center">
                                    <div class="title-heading mt-4">
                                        <h6 class="text-light para-dark animated fadeInDownBig animation-delay-1">The Best Coworking in The City</h6>
                                        <h1 class="heading mb-3 text-white title-dark animated fadeInUpBig animation-delay-3">Office Space in Vietnam</h1>
                                        <p class="para-desc mx-auto text-light para-dark animated fadeInUpBig animation-delay-7">Launch your campaign and benefit from our expertise on designing and managing conversion centered bootstrap4 html page.</p>
                                        <div class="text-center subcribe-form mt-4 pt-2 animated fadeInUpBig animation-delay-11">
                                            <form>
                                                <div class="form-group">
                                                    <input type="email" id="email" name="email" class="rounded" placeholder="E-mail">
                                                    <button type="submit" class="btn btn-primary">Book Space</button>
                                                </div>
                                            </form><!--end form-->
                                        </div><!--end subscribe form-->
                                    </div>
                                </div><!--end col-->
                            </div><!--end row-->
                        </div><!--end container-->
                    </div><!--end carousel item-->

                    <div class="carousel-item align-items-center" style="background-image:url('images/coworking/bg03.jpg');">
                        <div class="bg-overlay"></div>
                        <div class="container">
                            <div class="row justify-content-center">
                                <div class="col-lg-12 text-center">
                                    <div class="title-heading mt-4">
                                        <h6 class="text-light para-dark animated fadeInDownBig animation-delay-1">Our Space for You</h6>
                                        <h1 class="heading mb-3 text-white title-dark animated fadeInUpBig animation-delay-3">Own Your Office For A Day</h1>
                                        <p class="para-desc mx-auto text-light para-dark animated fadeInUpBig animation-delay-7">Launch your campaign and benefit from our expertise on designing and managing conversion centered bootstrap4 html page.</p>
                                        <div class="watch-video mt-4 pt-2 animated fadeInUpBig animation-delay-11">
                                            <a href="http://vimeo.com/99025203" class="video-play-icon watch text-white title-dark mb-2 ml-2"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle text-white title-dark position-relative play play-iconbar"></i> WATCH VIDEO</a>
                                        </div>
                                    </div>
                                </div><!--end col-->
                            </div><!--end row-->
                        </div><!--end container-->
                    </div><!--end carousel item-->
                </div><!--end carousel inner-->
                <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
            </div><!--end carousel-->
        </section><!--end section-->
        <!-- Hero End -->

        <!-- Partners start -->
        <section class="py-5 border-bottom border-top">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <h5>Trusted client by over 10,000+ of the world’s</h5>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row mt-5 justify-content-center">
                    <div class="col-lg-2 col-md-2 col-6 text-center">
                        <img src="images/client/amazon.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->

                    <div class="col-lg-2 col-md-2 col-6 text-center">
                        <img src="images/client/google.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/lenovo.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/paypal.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/shopify.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/spotify.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Partners End -->
        
        <!-- About Start -->
        <section class="section">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-5 col-md-6 col-12">
                        <img src="images/coworking/about.jpg" class="img-fluid rounded" alt="">
                    </div><!--end col-->

                    <div class="col-lg-7 col-md-6 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <div class="section-title ml-lg-4">
                            <h4 class="title mb-4">About Our Community</h4>
                            <p class="text-muted">Start working with <span class="text-primary font-weight-bold">Landrick Space</span> that can provide everything you need to generate awareness, drive traffic, connect. Dummy text is text that is used in the publishing industry or by web designers to occupy the space which will later be filled with 'real' content. This is required when, for example, the final text is not yet available. Dummy texts have been in use by typesetters since the 16th century.</p>
                            <a href="javascript:void(0)" class="btn btn-primary mt-3">Join now</a>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--enc container-->
        </section><!--end section-->
        <!-- About End -->

        <!-- Services Start -->
        <section class="section bg-light">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Your Comfort is Our Priority</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row">
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/wifi.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Fast Internet</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/printer.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Printer & Fax</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/serving-dish.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Modern Kitchen</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/24-hours.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">24 Hr Access</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/mail2.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Mail Service</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/calendar_b.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Events Space</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/question.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Conference Rooms</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-6 mt-4 pt-2">
                        <div class="features text-center pt-3 pb-3">
                            <img src="images/icon/coffee-cup.svg" height="50" alt="">
                            <div class="content mt-3">
                                <h4 class="title-2">Organic Tea & Coffee</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Services End -->

        <!-- CTA START -->
        <section class="section">
            <div class="container">
                <div class="card bg-light rounded border-0 overflow-hidden">
                    <div class="row no-gutters align-items-center">
                        <div class="col-lg-6">
                            <img src="images/coworking/cta.jpg" class="img-fluid" alt="">
                        </div><!--end col-->

                        <div class="col-lg-6 text-center">
                            <div class="card-body section-title p-md-5">
                                <a href="http://vimeo.com/287684225" class="play-btn mt-0 border border-light text-center video-play-icon">
                                    <i data-feather="play" class="fea icon-ex-md text-dark"></i>
                                </a>
                                <h4 class="title mb-4 mt-4">We Are Creative Dreamers and Co-workers</h4>
                                <p class="text-muted mx-auto para-desc mb-0">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                            </div>
                        </div><!--end col-->
                    </div>
                </div>
            </div><!--end container-->

            <!-- Start Price -->
            <div class="container mt-100 mt-60">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Choose The Pricing Plan</h4>
                            <p class="text-muted para-desc mb-0 mx-auto">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row align-items-center">
                    <div class="col-md-3 col-12 mt-4 pt-2">
                        <div class="card pricing-rates best-plan rounded bg-light text-center border-0">
                            <div class="card-body py-5">
                                <img src="images/icon/lightbulb.svg" class="mb-4" height="50" alt="">
                                <h2 class="title text-uppercase mb-4">Member</h2>
                                <div class="d-flex justify-content-center mb-4">
                                    <span class="h4 mb-0 mt-2">$</span>
                                    <span class="price h1 mb-0">19</span>
                                    <span class="h4 align-self-end mb-1">/mo</span>
                                </div>

                                <p class="text-muted">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                                <a href="javascript:void(0)" class="btn btn-outline-primary btn-sm mt-4">Buy Now</a>
                            </div>
                        </div>
                    </div><!--end col-->

                    <div class="col-md-3 col-12 mt-4 pt-2">
                        <div class="card pricing-rates best-plan rounded shadow text-center overflow-hidden border-0">
                            <div class="lable text-center bg-primary pt-2 pb-2">
                                <h6 class="best text-white mb-0 text-uppercase">Best</h6>
                            </div>
                            <div class="card-body py-5">
                                <img src="images/icon/table.svg" class="mb-4" height="50" alt="">
                                <h2 class="title text-uppercase mb-4">Desk</h2>
                                <div class="d-flex justify-content-center mb-4">
                                    <span class="h4 mb-0 mt-2">$</span>
                                    <span class="price h1 mb-0">39</span>
                                    <span class="h4 align-self-end mb-1">/mo</span>
                                </div>
                                
                                <p class="text-muted">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                                <a href="javascript:void(0)" class="btn btn-outline-primary btn-sm mt-4">Get Started</a>
                            </div>
                        </div>
                    </div><!--end col-->

                    <div class="col-md-3 col-12 mt-4 pt-2">
                        <div class="card pricing-rates best-plan rounded bg-light text-center border-0">
                            <div class="card-body py-5">
                                <img src="images/icon/star.svg" class="mb-4" height="50" alt="">
                                <h2 class="title text-uppercase mb-4">Dedicated</h2>
                                <div class="d-flex justify-content-center mb-4">
                                    <span class="h4 mb-0 mt-2">$</span>
                                    <span class="price h1 mb-0">49</span>
                                    <span class="h4 align-self-end mb-1">/mo</span>
                                </div>
                                
                                <p class="text-muted">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                                <a href="javascript:void(0)" class="btn btn-outline-primary btn-sm mt-4">Get Started</a>
                            </div>
                        </div>
                    </div><!--end col-->

                    <div class="col-md-3 col-12 mt-4 pt-2">
                        <div class="card pricing-rates best-plan rounded bg-light text-center border-0">
                            <div class="card-body py-5">
                                <img src="images/icon/start-up.svg" class="mb-4" height="50" alt="">
                                <h2 class="title text-uppercase mb-4">Office</h2>
                                <div class="d-flex justify-content-center mb-4">
                                    <span class="h4 mb-0 mt-2">$</span>
                                    <span class="price h1 mb-0">59</span>
                                    <span class="h4 align-self-end mb-1">/mo</span>
                                </div>

                                <p class="text-muted">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                                <a href="javascript:void(0)" class="btn btn-outline-primary btn-sm mt-4">Try It Now</a>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
            <!-- End Price -->
        </section><!--end section-->
        <!-- CTA END -->

        <!-- Start Client And Blog -->
        <section class="section bg-light">
            <!-- Start Client -->
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Trusted Co-workers</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row justify-content-center">
                    <div class="col-lg-12 mt-4">
                        <div id="customer-testi" class="owl-carousel owl-theme">
                            <div class="media customer-testi m-2">
                                <img src="images/client/01.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" It seems that only fragments of the original text remain in the Lorem Ipsum texts used today. "</p>
                                    <h6 class="text-primary">- Thomas Israel <small class="text-muted">C.E.O</small></h6>
                                </div>
                            </div>
                            
                            <div class="media customer-testi m-2">
                                <img src="images/client/02.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star-half text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" One disadvantage of Lorum Ipsum is that in Latin certain letters appear more frequently than others. "</p>
                                    <h6 class="text-primary">- Barbara McIntosh <small class="text-muted">M.D</small></h6>
                                </div>
                            </div>

                            <div class="media customer-testi m-2">
                                <img src="images/client/03.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" The most well-known dummy text is the 'Lorem Ipsum', which is said to have originated in the 16th century. "</p>
                                    <h6 class="text-primary">- Carl Oliver <small class="text-muted">P.A</small></h6>
                                </div>
                            </div>

                            <div class="media customer-testi m-2">
                                <img src="images/client/04.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" According to most sources, Lorum Ipsum can be traced back to a text composed by Cicero. "</p>
                                    <h6 class="text-primary">- Christa Smith <small class="text-muted">Manager</small></h6>
                                </div>
                            </div>

                            <div class="media customer-testi m-2">
                                <img src="images/client/05.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" There is now an abundance of readable dummy texts. These are usually used when a text is required. "</p>
                                    <h6 class="text-primary">- Dean Tolle <small class="text-muted">Developer</small></h6>
                                </div>
                            </div>

                            <div class="media customer-testi m-2">
                                <img src="images/client/06.jpg" class="avatar avatar-small mr-3 rounded shadow" alt="">
                                <div class="media-body content p-3 shadow rounded bg-white position-relative">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <p class="text-muted mt-2">" Thus, Lorem Ipsum has only limited suitability as a visual filler for German texts. "</p>
                                    <h6 class="text-primary">- Jill Webb <small class="text-muted">Designer</small></h6>
                                </div>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
            <!-- End Client -->

            <!-- Start Blog -->
            <div class="container mt-100 mt-60">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Latest News & Events</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row">
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="card blog rounded border-0 shadow">
                            <div class="position-relative">
                                <img src="images/blog/01.jpg" class="card-img-top rounded-top" alt="...">
                            <div class="overlay rounded-top bg-dark"></div>
                            </div>
                            <div class="card-body content">
                                <h5><a href="javascript:void(0)" class="card-title title text-dark">Design your apps in your own way</a></h5>
                                <div class="post-meta d-flex justify-content-between mt-3">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item mr-2 mb-0"><a href="javascript:void(0)" class="text-muted like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
                                        <li class="list-inline-item"><a href="javascript:void(0)" class="text-muted comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
                                    </ul>
                                    <a href="page-blog-detail.html" class="text-muted readmore">Read More <i class="mdi mdi-chevron-right"></i></a>
                                </div>
                            </div>
                            <div class="author">
                                <small class="text-light user d-block"><i class="mdi mdi-account"></i> Calvin Carlo</small>
                                <small class="text-light date"><i class="mdi mdi-calendar-check"></i> 13th August, 2019</small>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="card blog rounded border-0 shadow">
                            <div class="position-relative">
                                <img src="images/blog/02.jpg" class="card-img-top rounded-top" alt="...">
                            <div class="overlay rounded-top bg-dark"></div>
                            </div>
                            <div class="card-body content">
                                <h5><a href="javascript:void(0)" class="card-title title text-dark">How apps is changing the IT world</a></h5>
                                <div class="post-meta d-flex justify-content-between mt-3">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item mr-2 mb-0"><a href="javascript:void(0)" class="text-muted like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
                                        <li class="list-inline-item"><a href="javascript:void(0)" class="text-muted comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
                                    </ul>
                                    <a href="page-blog-detail.html" class="text-muted readmore">Read More <i class="mdi mdi-chevron-right"></i></a>
                                </div>
                            </div>
                            <div class="author">
                                <small class="text-light user d-block"><i class="mdi mdi-account"></i> Calvin Carlo</small>
                                <small class="text-light date"><i class="mdi mdi-calendar-check"></i> 13th August, 2019</small>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="card blog rounded border-0 shadow">
                            <div class="position-relative">
                                <img src="images/blog/03.jpg" class="card-img-top rounded-top" alt="...">
                            <div class="overlay rounded-top bg-dark"></div>
                            </div>
                            <div class="card-body content">
                                <h5><a href="javascript:void(0)" class="card-title title text-dark">Smartest Applications for Business</a></h5>
                                <div class="post-meta d-flex justify-content-between mt-3">
                                    <ul class="list-unstyled mb-0">
                                        <li class="list-inline-item mr-2 mb-0"><a href="javascript:void(0)" class="text-muted like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
                                        <li class="list-inline-item"><a href="javascript:void(0)" class="text-muted comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
                                    </ul>
                                    <a href="page-blog-detail.html" class="text-muted readmore">Read More <i class="mdi mdi-chevron-right"></i></a>
                                </div>
                            </div>
                            <div class="author">
                                <small class="text-light user d-block"><i class="mdi mdi-account"></i> Calvin Carlo</small>
                                <small class="text-light date"><i class="mdi mdi-calendar-check"></i> 13th August, 2019</small>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
            <!-- End Blog -->
        </section><!--end section-->
        <!-- End Client And Blog -->

        <!-- Start Form -->
        <section class="section" style="background: url('images/coworking/bg04.jpg') center center;">
            <div class="bg-overlay"></div>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-8 col-md-7">
                        <div class="section-title mr-lg-4">
                            <h4 class="title title-dark text-light mb-4">We are Built for Business – Explore Us Today !</h4>
                            <p class="text-light para-dark para-desc mb-0">Start working with <span class="text-success font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                            <div class="watch-video mt-4 pt-2">
                                <a href="javascript:void(0)" class="btn btn-primary mb-2 mr-2">Install Now</a>
                                <a href="http://vimeo.com/99025203" class="video-play-icon watch title-dark text-light mb-2"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle text-white title-dark position-relative play play-iconbar"></i> WATCH VIDEO</a>
                            </div>
                        </div>
                    </div><!--end col-->

                    <div class="col-lg-4 col-md-5 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <div class="card rounded shadow border-0">
                            <div class="card-body">
                                <h5 class="text-center">Become A Member</h5>

                                <form>
                                    <div class="row mt-4">
                                        <div class="col-lg-12">
                                            <div class="form-group mb-3 position-relative">
                                                <label>Your Name <span class="text-danger">*</span></label>
                                                <i data-feather="user" class="fea icon-sm icons"></i>
                                                <input name="name" id="name3" type="text" class="form-control pl-5" placeholder="Name" required="">
                                            </div>
                                        </div><!--end col-->
    
                                        <div class="col-lg-12">
                                            <div class="form-group mb-3 position-relative">
                                                <label>Your Email <span class="text-danger">*</span></label>
                                                <i data-feather="mail" class="fea icon-sm icons"></i>
                                                <input type="email" id="email3" class="form-control pl-5" placeholder="Email" name="email" required="">
                                            </div>
                                        </div><!--end col-->
    
                                        <div class="col-md-12">
                                            <div class="form-group position-relative">
                                                <label>Your Phone no. :<span class="text-danger">*</span></label>
                                                <i data-feather="phone" class="fea icon-sm icons"></i>
                                                <input name="number" id="number" type="number" class="form-control pl-5" placeholder="Phone no. :" required="">
                                            </div> 
                                        </div><!--end col-->
    
                                        <div class="col-lg-12 mb-0">
                                            <button class="btn btn-primary btn-block">Started now</button>
                                        </div><!--end col-->
                                    </div><!--end row-->
                                </form><!--end form-->
                            </div>
                        </div>                             
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- End Form -->

        <!-- Footer Start -->
        <footer class="footer">
            <div class="container">
                <div class="row">
                    <div class="col-lg-4 col-12 mb-0 mb-md-4 pb-0 pb-md-2">
                        <a href="#" class="logo-footer">
                            <img src="images/logo-light.png" height="24" alt="">
                        </a>
                        <p class="mt-4">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        <ul class="list-unstyled social-icon social mb-0 mt-4">
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="facebook" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="instagram" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="twitter" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="linkedin" class="fea icon-sm fea-social"></i></a></li>
                        </ul><!--end icon-->
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Company</h4>
                        <ul class="list-unstyled footer-list mt-4">
                            <li><a href="page-aboutus.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> About us</a></li>
                            <li><a href="page-services.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Services</a></li>
                            <li><a href="page-team.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Team</a></li>
                            <li><a href="page-pricing.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Pricing</a></li>
                            <li><a href="page-work-modern.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Project</a></li>
                            <li><a href="page-jobs.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Careers</a></li>
                            <li><a href="page-blog-grid.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Blog</a></li>
                            <li><a href="auth-cover-login.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Login</a></li>
                        </ul>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Usefull Links</h4>
                        <ul class="list-unstyled footer-list mt-4">
                            <li><a href="page-terms.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Terms of Services</a></li>
                            <li><a href="page-privacy.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Privacy Policy</a></li>
                            <li><a href="documentation.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Documentation</a></li>
                            <li><a href="changelog.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Changelog</a></li>
                            <li><a href="components.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Components</a></li>
                        </ul>
                    </div><!--end col-->

                    <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Newsletter</h4>
                        <p class="mt-4">Sign up and receive the latest tips via email.</p>
                        <form>
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="foot-subscribe form-group position-relative">
                                        <label>Write your email <span class="text-danger">*</span></label>
                                        <i data-feather="mail" class="fea icon-sm icons"></i>
                                        <input type="email" name="email" id="emailsubscribe" class="form-control pl-5 rounded" placeholder="Your email : " required>
                                    </div>
                                </div><!--end col-->

                                <div class="col-lg-12">
                                    <input type="submit" id="submitsubscribe" name="send" class="btn btn-soft-primary btn-block" value="Subscribe">
                                </div><!--end col-->
                            </div><!--end row-->
                        </form><!--end form-->
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </footer><!--end footer-->
        <footer class="footer footer-bar">
            <div class="container text-center">
                <div class="row align-items-center">
                    <div class="col-sm-6">
                        <div class="text-sm-left">
                            <p class="mb-0">© 2019-20 Landrick. Design with <i class="mdi mdi-heart text-danger"></i> by <a href="http://www.shreethemes.in/" target="_blank" class="text-reset">Shreethemes</a>.</p>
                        </div>
                    </div><!--end col-->

                    <div class="col-sm-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <ul class="list-unstyled text-sm-right mb-0">
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/american-ex.png" class="avatar avatar-ex-sm" title="American Express" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/discover.png" class="avatar avatar-ex-sm" title="Discover" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/master-card.png" class="avatar avatar-ex-sm" title="Master Card" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/paypal.png" class="avatar avatar-ex-sm" title="Paypal" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/visa.png" class="avatar avatar-ex-sm" title="Visa" alt=""></a></li>
                        </ul>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </footer><!--end footer-->
        <!-- Footer End -->

        <!-- Start Style switcher -->
        <div id="style-switcher" style="left: 0px;" class="bg-light border p-3 pt-2 pb-2">
            <h3 class="title text-center">Select Your Color</h3>
            <ul class="pattern text-center mb-2">
                <li class="list-inline-item">
                    <a class="default" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="green" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="red" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="skyblue" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="skobleoff" href="#"></a>
                </li>  
                <li class="list-inline-item">
                    <a class="cyan" href="#"></a>
                </li>            
            </ul>

            <h3 class="title text-center pt-3 mb-0 border-top">Theme Option</h3>
            <div class="text-center">
                <a href="#" class="btn btn-sm w-100 btn-primary rtl-version t-rtl-light mt-2">RTL</a>
                <a href="#" class="btn btn-sm w-100 btn-primary ltr-version t-ltr-light mt-2">LTR</a>
                <a href="#" class="btn btn-sm w-100 btn-primary dark-rtl-version t-rtl-dark mt-2">RTL</a>
                <a href="#" class="btn btn-sm w-100 btn-primary dark-ltr-version t-ltr-dark mt-2">LTR</a>
                <a href="#" class="btn btn-sm w-100 btn-dark dark-version t-dark mt-2">Dark</a>
                <a href="#" class="btn btn-sm w-100 btn-dark light-version t-light mt-2">Light</a>
            </div>
            <div class="bottom">
                <a href="#" class="settings bg-white shadow d-block"><i class="mdi mdi-cog ml-1 mdi-24px position-absolute mdi-spin text-primary"></i></a>
            </div>
        </div>
        <!-- End Style switcher -->

        <!-- Back to top -->
        <a href="#" class="btn btn-icon btn-soft-primary back-to-top"><i data-feather="arrow-up" class="icons"></i></a>
        <!-- Back to top -->

        <!-- javascript -->
        <script src="js/jquery-3.5.1.min.js"></script>
        <script src="js/bootstrap.bundle.min.js"></script>
        <script src="js/jquery.easing.min.js"></script>
        <script src="js/scrollspy.min.js"></script>
        <!-- Magnific Popup -->
        <script src="js/jquery.magnific-popup.min.js"></script> 
        <script src="js/magnific.init.js"></script> 
        <!-- SLIDER -->
        <script src="js/owl.carousel.min.js "></script>
        <script src="js/owl.init.js "></script>
        <!-- Icons -->
        <script src="js/feather.min.js"></script>
        <script src="https://unicons.iconscout.com/release/v2.1.9/script/monochrome/bundle.js"></script>
        <!-- Switcher -->
        <script src="js/switcher.js"></script>
        <!-- Main Js -->
        <script src="js/app.js"></script>
    </body>
</html>